<template>
  <div>
    <el-form ref="form" :model="formData">
      <div v-for="(item,index) in items" :key="index">
        <el-form-item :label="item">
          <el-cascader v-model="values[index]" :props="props(item)"></el-cascader>
        </el-form-item>
      </div>
      <el-button type="primary" @click="submit">提交1</el-button>
    </el-form>
  </div>
</template>

<script>
export default {
  data() {
    return {
      formData: {},
      items: ['业务1：', '业务2：', '业务3：'],
      values: [],
    };
  },
  methods: {
    props(item) {
      let id = 0;
      return {
        lazy: true,
        lazyLoad(node, resolve) {
          console.log(item)
          console.log(node)

          const {level} = node;

          setTimeout(() => {
            const nodes = Array.from({length: level + 1})
                .map(() => ({
                  value: {id:id,name:`选项${++id}`},
                  label: `选项${id}`,
                  leaf: level >= 2
                }));
            // 通过调用resolve将子节点数据返回，通知组件数据加载完成
            resolve(nodes);
          }, 1000);
        }
      }
    },
    async submit() {
      console.log(this.values)
    }
  }
};
</script>